<script lang="jsx" setup>
import { ref } from 'vue';
import { UUID } from 'uuidjs';
import { getStorageInfo } from '@/service/api/modules/trace/one-code-trace';

const tableRef = ref(null);
const tableData = ref([]);
const column = [
  {
    key: 'dataIndex',
    dataIndex: 'dataIndex',
    title: '序号',
    width: 70,
    fixed: 'left',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'custProdNo',
    dataIndex: 'custProdNo',
    title: '客户型号',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'packNo',
    dataIndex: 'packNo',
    title: '箱标签',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'qty',
    dataIndex: 'qty',
    title: '数量',
    align: 'center',
    checked: true,
    ellipsis: true,
    customRender: ({ record }) => {
      return <span title={`${record.qty}(${record.unit})`}>{`${record.qty}(${record.unit})`}</span>;
    }
  },
  {
    key: 'createBy',
    dataIndex: 'createBy',
    title: '入库人',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'updateDate',
    dataIndex: 'updateDate',
    title: '入库时间',
    align: 'center',
    checked: true,
    ellipsis: true
  }
];

const params = ref({});

function setSearchParams(data) {
  params.value = data;
}

const page = ref({
  pageNum: 1,
  pageSize: 200
});
const loading = ref(false);
function handlePageChange(pageNum, pageSize) {
  page.value.pageNum = pageNum;
  page.value.pageSize = pageSize;
  getTableData();
}

function getData() {
  loading.value = true;
  getStorageInfo({
    ...params.value,
    pageNum: page.value.pageNum,
    pageSize: page.value.pageSize
  })
    .then(({ data, error }) => {
      if (!error) {
        data.list.forEach((item, index) => {
          item.tableUuid = UUID.generate();
          item.dataIndex = index + 1;
        });
        tableData.value = data.list;
        tableRef.value.setPagination(data.total);
      }
    })
    .finally(() => {
      loading.value = false;
    });
}

function reset() {
  tableRef.value.setPagination(0);
  tableData.value = [];
  params.value = {};
  page.value = {
    pageNum: 1,
    pageSize: 200
  };
}

defineExpose({
  reset,
  setSearchParams,
  getData
});
</script>

<template>
  <div class="into-stash h-full w-full">
    <Table
      ref="tableRef"
      :column="column"
      :show-row-selection="false"
      :data-source="tableData"
      :loading="loading"
      :scroll="{ y: 'auto' }"
      :is-init-get-data="false"
      row-key="tableUuid"
      class="h-full"
      :row-height="40"
      :show-card-header="false"
      @pagination-change="handlePageChange"
    ></Table>
  </div>
</template>

<style lang="scss" scoped>
.into-stash {
  padding-top: 10px;
  :deep(.ant-card) {
    .ant-card-body {
      padding-bottom: 0;
      .surely-table-wrapper {
        .ant-spin-nested-loading {
          .surely-table-column-title {
            color: #646cff;
            font-weight: bold;
          }
        }
      }
    }
  }
}
</style>
